<template>
  <div class="general-table-wrapper">
    <el-table :data="tableData" ref="multipleTable" style="width: 100%" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55"></el-table-column>
      <el-table-column label="序号" width="50">
        <template slot-scope="scope">{{ scope.$index + 1 }}</template>
      </el-table-column>
      <el-table-column label="日期" prop="date"></el-table-column>
      <el-table-column label="姓名" prop="name"></el-table-column>
      <el-table-column label="地址" prop="address" show-overflow-tooltip></el-table-column>
      <el-table-column label="操作">
        <template>
          <el-link type="primary" :underline="false" icon="el-icon-view">查看</el-link>
          <el-link type="success" :underline="false" icon="el-icon-edit">编辑</el-link>
          <el-link type="danger" :underline="false" icon="el-icon-delete">删除</el-link>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
var tabledddd = [
  {
    date: '2016-05-03',
    name: '王小虎',
    address: '上海市普陀区金沙江路 1518 弄'
  },
  {
    date: '2016-05-02',
    name: '王小虎',
    address: '上海市普陀区金沙江路 1518 弄'
  },
  {
    date: '2016-05-04',
    name: '王小虎',
    address: '上海市普陀区金沙江路 1518 弄'
  }
]
export default {
  name: 'GeneralTable',
  data () {
    return {
      tableData: tabledddd,
      multipleSelection: []
    }
  },
  methods: {
    handleSelectionChange (val) {
      console.log(val)
      this.multipleSelection = val
    },
    fun (scope) {
      console.log(scope)
      return scope.row.date
    }
  }
}
</script>

<style lang="scss" scoped>
.general-table-wrapper {
  .el-link {
    margin-right: 13px;
    .el-link--inner {
      background-color: red;
    }
  }
}
</style>
